<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      /* 
            什么是拷贝？
                把一个值复制一份用另一个值保存，两个值的地址是不相等的

            浅拷贝：
                只拷贝了一层，对象内部如果还有对象类型的数据，则拷贝前后的两个对象都是共享的
        */

      const obj1 = {
        name: "xiaowang",
        age: 18,
        hobby: ["唱", "跳", "rap"],
      };

      // 1. 地址的赋值，不是拷贝，而是得到了一个别名
      const obj2 = obj1;
      console.log(obj1 === obj2); //true

      //2.浅拷贝
      const obj3 = {};
      for (let key in obj1) {
        //先获取到obj1[key]对应当前key的值，赋值给obj3新扩展的key属性的值
        obj3[key] = obj1[key];
      }

      console.log(obj3, obj1 === obj3); //false
      console.log(obj1.hobby === obj3.hobby); //true

      //3. 浅拷贝
      const obj4 = { ...obj1 };
      console.log(obj4 === obj1); //false
      console.log(obj4.hobby === obj1.hobby); //true
    </script>
  </body>
</html>
